import React, { Component } from 'react';
import Taro from '@tarojs/taro';
import {Block, View} from '@tarojs/components'
import {http} from "../../../utils/http";
import {GET_PERSON_INFO, PLATFORM_SET, TARO_ENV} from "../../../constants/api";
import './waterMark.scss'

export default class Index extends Component {
  state: {
    arr: any
    userName: string
  } = {
    arr: [],
    userName: ''
  }

  async UNSAFE_componentWillMount() {
    const ret = await http.get(PLATFORM_SET, {})
    if (ret) {
      if (!!ret.is_watermark){
        const arr = []
        let userName
        if (TARO_ENV === 'h5'){
          const info = await http.get(GET_PERSON_INFO, {})
          userName = info.nick_name
        } else {
          const user = Taro.getStorageSync('user')
          userName = user.userInfo.nickName || ''
        }
        for (let i = 0; i < 100; i++) arr.push(i)
        await this.setStateSync({ arr, userName })
      }
    }
  }
  setStateSync(state) {
    return new Promise(resolve => {
      this.setState(state, resolve);
    });
  }
  render () {
    const { arr, userName } = this.state
    return (
      <Block>
        <View className='water_top' style='pointer-events: none;'>
          { arr.map(item=> <View key={item} className='water-text'>{ userName }</View>) }
        </View>
      </Block>
    )
  }
}
